<script type="text/javascript">

    var grid_import_reload = function() {
        $('#datagrid_import').datagrid('reload', $('#fm_search_import').serializeObject());
    };
    
	var f_new_import = function(){
		setLoading(false);
		$('#btn_import, #btn_new_import').hide();
		$('#label_file_import, #my_file, #btn_upload').fadeIn();
	};
	
	var f_import_upload_file = function(){
		console.log("disini rusaknya");
		// setLoading(true);
		$('#fm_upload_import').submit();
	};
	
	var f_import_file_to_db = function(as_filename){
		console.log(as_filename);
		setLoading(true);
		$.ajax({
			type: 'POST', 
			url: gs_path+'/'+controller+'/import_file_to_db', 
			cache: false, 
			data: { 
				filename:as_filename, 
				ajax: '0', 
				culture: gs_localize, 
				sessid: sessid 
			},
			success: function(data) {
				console.log(data); 
				setLoading(false); 

				try{ 
					eval(data); 
				} catch(e){ 
					console.log("Sukses tapi masuk catch hrd_absen/from_import.php->f_import_file_to_db"); 
				} 
			},
			error: function(xhr, ajaxOptions, thrownError) { 
				var ls_message = ''; 
				if (xhr.status == 0) { 
					ls_message = 'You are offline!!\n Please Check Your Network.'; 
				} else if (xhr.status == 404) { 
					ls_message = 'Requested URL not found.'; 
				} else if (xhr.status == 500) { 
					ls_message = 'Internal Server Error.'; 
				} else if (thrownError == 'parsererror') { 
					ls_message = 'Error.\nParsing JSON Request failed.' 
				} else if (thrownError == 'timeout') { 
					ls_message = 'Request Time out.'; 
				} else { 
					ls_message = 'Unknow Error.\n' + xhr.responseText; 
				} 

				alert(ls_message); 
				setLoading(false); 
			}, 
			dataType: "html"
		});
	};
	
	/*var f_import_transfer = function(){
		setLoading(true);
		$.ajax({
			type: 'POST', 
			url: gs_path+'/'+controller+'/import_transfer', 
			cache: false, 
			data: { 
				ajax: '0', 
				culture: gs_localize, 
				sessid: sessid 
			},
			success: function(data) { 
				setLoading(false); 
				try{ 
					eval(data); 
				} catch(e){ 
					alert(data); 
				} 
			},
			error: function(xhr, ajaxOptions, thrownError) { 
				var ls_message = ''; 
				if (xhr.status == 0) { 
					ls_message = 'You are offline!!\n Please Check Your Network.'; 
				} else if (xhr.status == 404) { 
					ls_message = 'Requested URL not found.'; 
				} else if (xhr.status == 500) { 
					ls_message = 'Internal Server Error.'; 
				} else if (thrownError == 'parsererror') { 
					ls_message = 'Error.\nParsing JSON Request failed.' 
				} else if (thrownError == 'timeout') { 
					ls_message = 'Request Time out.'; 
				} else { 
					ls_message = 'Unknow Error.\n' + xhr.responseText; 
				} 

				alert(ls_message); setLoading(false); 
			}, 
			dataType: "html"
		});
	};*/
	
    $(document).ready(function() {
    	$('#tb_import').setupForm([
			{ name: 'date_from', type: 'date', size: 'short'},
			{ name: 'date_to', type: 'date', size: 'short'}
		], <?php echo json_encode($data); ?>);

		$('#btn_upload, #btn_import, #btn_new_import, #fm_search_import .easyui-linkbutton').linkbutton({  
			plain:true  
		});
		
		$('#my_file').change(function(){
			var ls_filename = $(this).val();
			
		});
		
		// Setup Datagrid
		$('#datagrid_import').datagrid({  
			url:gs_path+'/'+controller+'/getimportdata', 
			queryParams: $('#fm_search_import').serializeObject(),
			width:780,
			height:410,
			pagination:true,
			singleSelect:true,
			columns:[[
				// { field : 'index_no', title : 'No', width : 30, align:'center', sortable:true },
				{ field : 'nama_karyawan', title : 'Nama Karyawan', width : 200, sortable:true },
				{ field : 'hari', title : 'hari', width : 70, sortable:true },
				{ field : 'tgl_masuk', title : 'Tgl Masuk', width : 80, align:'center', formatter:function(val){ return formatDate(val); }, sortable:true },
				{ field : 'tgl_keluar', title : 'Tgl Keluar', width : 80, align:'center', formatter:function(val){ return formatDate(val); }, sortable:true },
				{ field : 'jam_masuk', title : 'Jam Masuk', width : 70 },
				{ field : 'jam_keluar', title : 'Jam Keluar', width : 70 },
				{ field : 'telat', title : 'Telat', width : 70, sortable:true },
				{ field : 'nama_status_absen', title : 'Status', width : 70, sortable:true },
				// { field : 'field4', title : 'Field 4', width : 80, align:'right', formatter:function(val){ return formatNumeric(val,2); }, sortable:true },
			]],
			rowStyler:function(index,row,css){
				// console.log(row.nama_status_absen);
				if(row.nama_status_absen != null) {
					if (row.nama_status_absen.toLowerCase() =='alpha'){
						return 'background-color:#FF0080;color:#fff;font-weight:bold;';
					}
				}
			}
		});
	});
</script>
<div id="tb_import" style="padding:5px;height:auto">
    <div>
        <form id="fm_upload_import" target="if_submit" action="<?php echo base_url().$this->data['controller_name'].'/process_upload_file' ?>" enctype="multipart/form-data" method="post">
        	<table class="tb_form" style="margin-bottom:0px; width:100%;">
            <tr>
            	<td width="100"><span id="label_file_import">Upload File (.xls)</span></td>
                <td><input type="file" id="my_file" name="my_file" /></td>
                <td>
                	<div style="float:right;">
                        <a href="#" id="btn_upload" class="easyui-linkbutton" iconCls="icon-up" onclick="f_import_upload_file(); return false;">Upload</a>
                        <a href="#" id="btn_import" class="easyui-linkbutton" iconCls="icon-save" onclick="f_import_transfer(); return false;" style="display:none;">Import Data</a>
                        <a href="#" id="btn_new_import" class="easyui-linkbutton" iconCls="icon-excel" onclick="f_new_import(); return false;" style="display:none;">Upload Baru</a>
                    </div>
                </td>
            </tr>
            </table>
        </form>
        <form id="fm_search_import" onsubmit="grid_import_reload(); return false;" style="border-top:#CCC solid 1px; margin-top:6px;">
        	<table class="tb_form" style="margin-bottom:0px">
        	<tr>
				<td width="100">Tanggal Absen</td>
                <td><input type="text" id="date_from" name="date_from" class="textfield short" />_  
					<input type="text" id="date_to" name="date_to" class="textfield short" />
                
                </td>
			</tr>
            <tr>
            	<td width="100">Keyword</td>
                <td><input type="text" id="keyword" name="keyword" class="textfield medium" />
                	<a href="#" class="easyui-linkbutton" iconCls="icon-search" onclick="grid_import_reload(); return false;">Search</a>
                    <!-- <a href="#" class="easyui-linkbutton" iconCls="icon-blank-file" onclick="$('#fm_search_import').resetForm(); return false;">Reset</a> -->
                </td>
            </tr>
            </table>
        </form>
    </div>
</div>
<div id="datagrid_import" toolbar="#tb_import"></div>

<?php if(isset($title)){ ?><script type="text/javascript">$('#datagrid_import').parent().parent().parent().parent().parent().parent().parent().find('.panel-title').html('<?php echo addslashes($title); ?>');</script><?php } ?>